
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ page import="com.lkj.model.User" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path + "/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta http-equiv="Cache-Control" content="no-siteapp">

<link href="<%=request.getContextPath()%>/css/common.css" rel="stylesheet" />
<link href="<%=request.getContextPath()%>/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
<link href="<%=request.getContextPath()%>/bootstrap/css/fileinput.css" rel="stylesheet" />
<link href="<%=request.getContextPath()%>/bootstrap/css/fileinput.min.css" rel="stylesheet" />

<script src="<%=request.getContextPath() %>/scripts/jquery-1.9.1.min.js" type="text/javascript"></script>
<script type="text/javascript" src="<%=request.getContextPath() %>/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="<%=request.getContextPath() %>/bootstrap/js/bootstrap-paginator.js"></script>
<script type="text/javascript" src="<%=request.getContextPath() %>/bootstrap/js/fileinput.js"></script>
<script type="text/javascript" src="<%=request.getContextPath() %>/bootstrap/js/fileinput.min.js"></script>
<script type="text/javascript" src="<%=request.getContextPath() %>/bootstrap/js/zh.js"></script>
<script src="<%=request.getContextPath()%>/js/common.js"></script>
<title>华纵科技</title>

    <%
        User user = (User) request.getSession().getAttribute("user");
    %>

</head>

<body>
<!-- 顶部开始 -->
<div class="container-s">
	<div class="logo">
    	<a href="./index.html"><img src="<%=request.getContextPath() %>/img/logo.png" /></a>
    </div>
    <div class="top_search">
    	<!-- <form id="form_search" action="#" method="post">
            <a id="btn_search"></a>
            <input type="text" name="search" id="search" placeholder="请输入账号搜索..." />
        </form> -->
    </div>
    
    
    <div class="top_manage">
    	<div class="top_m_d">
        
        
        
        <script type="text/javascript">
			$(document).ready(function(){
					
				jQuery.navlevel2 = function(level1,dytime) {
					
				  $(level1).mouseenter(function(){
					  varthis = $(this);
					  delytime=setTimeout(function(){
						varthis.find('div').slideDown();
					},dytime);
					
				  });
				  $(level1).mouseleave(function(){
					 clearTimeout(delytime);
					 $(this).find('div').slideUp();
				  });
				  
				};
			  jQuery.navlevel2("div.mainlevel",200);
			});
			</script>
			
        	<div  class="mainlevel">
            	<span class="top_m_a"><%=user.getUsername()%></span>
            	<div>
                    <a href="#"><%=user.getUsername()%></a>
                    <a href="#" onclick="logout()">退出</a>
                </div>
            
            </div>
        </div>
    </div>
    
    <a id="top_set"></a>
    
    <div class="top_bell">
    	<span >2</span>
    </div>
    
</div>
<!-- 顶部结束 -->
<!-- 中部开始 -->
<!-- 左侧菜单开始 -->
<div class="left-nav">
    <ul class="ul-nav" style="margin: 0;">
        <li>
            <a href="#">
                <i class="i1"></i>
                <cite>用户管理</cite>
            </a>
        </li>
        <li>
            <a href="<%=request.getContextPath()%>/server/registerManger">
                <i></i>
                <cite>注册管理</cite>
            </a>
        </li>
        <li>
            <a href="<%=request.getContextPath()%>/server/accountManger">
                <i></i>
                <cite>账号管理</cite>
            </a>
        </li>
        <li>
            <a href="<%=request.getContextPath()%>/server/fileServerManger">
                <i class="i3"></i>
                <cite>文件服务器管理</cite>
            </a>
        </li>
        <li>
            <a href="<%=request.getContextPath()%>/server/videoManger">
                <i class="i2"></i>
                <cite>视频文件管理</cite>
            </a>
        </li>
       <%--  <li>
            <a href="<%=request.getContextPath()%>/client/videoList">
                <i ></i>
                <cite>视频列表</cite>
            </a>
        </li> --%>
       <%--  <li>
            <a href="<%=request.getContextPath()%>/client/videoList?order=desc">
                <i></i>
                <cite>最近视频</cite>
            </a>
        </li> --%>
        
        <li>
            <a href="<%=request.getContextPath()%>/server/statusManger">
                <i class="i4"></i>
                <cite>状态管理</cite>
            </a>
        </li>
        <li>
            <a href="<%=request.getContextPath()%>/server/sceneManger">
                <i class="i5"></i>
                <cite>场景维护</cite>
            </a>
        </li>
    
    </ul>
</div>
<!-- 左侧菜单结束 -->
<!-- 右侧主体开始 -->
<div class="page-content">
	<div class="page-content-d">
    	<div class="page-c-nav">
            <span>所有视频（&nbsp;<font id="total" style="font-size: 14px;font-weight: bold;" color="#5db8f1">0</font>&nbsp;）</span>           
            <ul class='view-nav'>
                <button class="on btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal" style="background:#5db8f1;float:left;line-height:20px;border:0;margin-right:9px;">上传</button>
               <%-- <form nameli cla2" action="<%=request.getContextPath() %>/server/upload" method="post"  enctype="multipart/form-data" >
                    <input type="file" name="file" multiple="multiple">
                    <input type="submit" value="上传" class="i1"/>
                </form>--%>
                <li><a id="znfx"><i class="i2"></i>智能分析</a></li>
                <%--<li><a href="#"><i class="i3"></i>调整顺序</a></li>--%>
                <%--<li class="w30"><a href="#"><i class="i4"></i></a></li>--%>
            </ul>
        </div>
        
        <div class="clear h25"></div>
        <div class="ss">
        	<form action="#" id="ssform" method="post" ><input id="ssinput" type="text" style="border: 0;padding: 5px 2px;width: 246px;"  placeholder="请输入名称搜索..." /><a id="ssbtn">搜索</a></form>
        </div><%--<span class="gjjs">高级检索</span>--%>
        <div class="clear h10"></div>
        
        <div class="bg-cf">
        <ul class="sp-list" id="videos"></ul>
        <div class="clear h25"></div>
       <!--  <div class="page">
            <table border="0" align="center" cellpadding="0" class="page1">
                <tbody><tr><td>
                    <ul>
                        
                        <li><a class="avrp"><font></font></a></li> 
                        <li class="pagered"><a>1</a></li>
                        <li ><a>2</a></li>
                        <li><a>3</a></li>
                        <li><a>4</a></li>
                        <li><a class="nextpa"><font class="f14 block fl">下一页</font><i class="nextP fl"></i></a></li>
                        <div class="pagef"><form id="pageform" method="post"><span>到</span><input type="text" id="pageinp" name="page"/><span>页</span><a id="btn_page">确定</a></form></div>
                    </ul>
                </td></tr></tbody>
            </table>
        </div> -->
        <center><ul id='bp-element'></ul></center>
        <div class="clear h25"></div>
        </div>
        
    </div>
	
</div>
<!-- 右侧主体结束 -->
<!-- 中部结束 -->

<!-- 模态框（Modal） -->
<div id="myModal" class="modal hide fade" tabindex="-1" data-width="760">
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
        <h3>上传视频</h3>
    </div>
    <div class="modal-body">
        <div class="row-fluid">
            <div class="span10">
                <h4>基本信息</h4>
                <p style="margin-top: 32px;">
                    <sapn class="span3">对应列车:</sapn>
                    <select tabindex="1" data-placeholder="Select here.." class="span9">
                        <option value="" disabled>Select here..</option>
                        <option value="Category 1">First Row</option>
                        <option value="Category 2">Second Row</option>
                        <option value="Category 3">Third Row</option>
                        <option value="Category 4">Fourth Row</option>
                    </select>
                </p>
                <p>
                    <sapn class="span3">备注:</sapn>
                    <input type="text" class="span9">
                </p>
                <p>
                    <sapn class="span3">视频文件:</sapn>
                    <input id="upload" name="upload" type="file" multiple>
                </p>
            </div>

        </div>
    </div>
    <div class="modal-footer">
        <button type="button" data-dismiss="modal" class="btn">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
    </div>
</div>
<!--结束-->


<script type="text/javascript">
    var contextTemp;
    var orderTemp;
    $(function() {
        initPage("asc","",1);

        $("#upload").fileinput({showCaption: false, dropZoneEnabled: false});

        /* $("#btn_search").click(function(){
            var search = $("#search").val();
            initPage(orderTemp,search,1);
        }) */
        $("#ssbtn").click(function(){
            var search = $("#ssinput").val();
            initPage(orderTemp,search,1);
        })
        $("#btn_page").click(function(){
            var search = $("#pageinp").val();
            if(search != ""){
                $("#pageform").submit();
            }else{
                alert("请输入跳转页码！");
                $("#pageinp").focus();
            }
        })

        $("#znfx").click(function(){
            var checkboxs = $('input:checkbox:checked');
            if(checkboxs.length == 0){
                alert("请至少选择一个视频");
            }else{
                var ids = "";
                $.each($('input:checkbox:checked'),function(){
                    ids += $(this).val()+",";
                });
                alert(ids);
                $.post("<%=request.getContextPath()%>/server/startCompute",{"ids":ids},function(result){
                    location.reload();
                });
            }
        })



        $(".sp-list li").hover(function() {
            $(this).find("em").animate({opacity: "show", top: "-75"}, "slow");
        }, function() {
            $(this).find("em").animate({opacity: "hide", top: "-85"}, "fast");
        });

        $(document).on("click",".updateBtn,.searchBtn,.cleanBtn,.video_li,.update-icon,.uploadbtn",function(){
            var th = $(this);
            //查找按钮
            if(th.hasClass("searchBtn")){
                initPage(orderTemp,$("input[name='context']").val(),1);
            }
            //清空按钮
            if(th.hasClass("cleanBtn")){
                $("input[name='context']").val("");
                initPage(orderTemp,"",1);
            }
            //修改按钮
            if(th.hasClass("update-icon")){
                var id = th.attr("value");
                $("input").val("");
                $("input[name='statusid']").val(id);
            }
            //修改提交按钮
            if(th.hasClass("updateBtn")){
                var datas = $("form").serialize();
                $.post("<%=request.getContextPath()%>/server/updateStatus",datas,function(data){
                    alert(data.result);
                },"json");
            }
        });
    });

    //初始化列表
    function initPage(isOrder,context,currentPage){
        var element = $('#bp-element');
        element.html("");

        contextTemp = context;
        orderTemp = isOrder;
        //列表展示
        $.post("<%=request.getContextPath()%>/server/getVideos",{"isOrder":isOrder,"context":context,"currentPage":currentPage},function(data){
            var tbody = "";
            var pageUtil = data.pageUtil;
            var status = "未处理";
            $.each(data.list,function(index,entry){
                if(entry.resultstatus == 1){
                    status = "处理中";
                }
                if(entry.resultstatus == 2){
                    status = "已处理";
                }
                tbody +=
                    "<li>"+
                    "<span><input type='checkbox' value='"+entry.fileid+"'/></span>"+
                    "<span class='spimg'></span>"+
                    "<span>"+
                    "<a href='#' class='spname'>"+entry.filename+"</a>"+
                    "<em class='spem'>"+
                    "<i><img src='<%=request.getContextPath()%>/img/down.png' /><a href='#'>下载</a></i>"+
                    "<i><img src='<%=request.getContextPath()%>/img/delete.png' /><a href='#'>删除</a></i>"+
                    "<i><img src='<%=request.getContextPath()%>/img/stop.png' /><a href='#'>停用</a></i>"+
                    "</em>"+
                    "<div class='clear'>上传者：<font class='blue'>"+entry.uploader+"</font></div>"+
                    "</span>"+

                    "<span class='fr marr40'><a href='#' class='fxwb'><i></i>"+status+"</a></span>"+
                    "<span class='fr '>"+
                    "创建时间：<font class='f-black'>"+entry.createtime+"</font><br />"+
                    "大小：<font class='blue'>"+entry.filesize+"</font>"+
                    "</span>"+

                    "<div class='clear'></div>"+
                    "</li>";
            })
            $("#videos").html(tbody);

            //搜索框赋值 (context,isOrder)
            $("#pageinp").val(pageUtil.context);
            $("#total").text(pageUtil.totalnum);
            //分页-s
            options = {
                bootstrapMajorVersion:3, //对应的bootstrap版本
                currentPage: pageUtil.currentPage, //当前页数，这里是用的EL表达式，获取从后台传过来的值
                numberOfPages: pageUtil.pagesize, //每页页数
                totalPages: pageUtil.totalpage,//总页数，这里是用的EL表达式，获取从后台传过来的值
                shouldShowPage:true,//是否显示该按钮
                itemTexts: function (type, page, current) {//设置显示的样式，默认是箭头
                    switch (type) {
                        case "first":
                            return "首页";
                        case "prev":
                            return "上一页";
                        case "next":
                            return "下一页";
                        case "last":
                            return "末页";
                        case "page":
                            return page;
                    }
                },
                //点击事件
                onPageClicked: function (event, originalEvent, type, page) {
                    initPage(isOrder,context,page);
                }
            };
            element.bootstrapPaginator(options);
            //分页-e

        },"json");
    }
</script>
</body>
</html>
